<template>
    <view style="width: 100%; height: 100%;padding: 20rpx;background: #efefef;">
        <view style="background: #fff;border-radius:8rpx;display: flex;flex-direction: column;padding: 0 20rpx;">
            <view
                style="font-size: 32rpx;color: #333333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;">
                采购订单号:&nbsp;&nbsp;{{ serviceList.orderNo }}</view>
            <view style="font-size: 32rpx;color: #333333">供应商名称:&nbsp;&nbsp;{{ serviceList.supplierName }}</view>
            <view
                style="font-size: 32rpx;color: #333333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;">
                供应商编码:&nbsp;&nbsp;{{ serviceList.supplierCode }}</view>
            <view style="display: flex;">
                <view style="font-size: 32rpx;color: #333333;width: 250rpx;">数量:&nbsp;&nbsp;{{ serviceList.amount }}
                </view>
                <view style="margin: auto;font-size: 32rpx;color: #333333">税额:&nbsp;&nbsp;{{ serviceList.taxAmount }}
                </view>
                <view></view>
            </view>
            <view style="display: flex;align-items: center;">
                <view style="font-size: 32rpx;color: #333333;width: 620rpx;">税率:&nbsp;&nbsp;{{ serviceList.taxRate }}
                </view>
                <view style="margin: auto;font-size: 32rpx;color: #333333">合同编号:&nbsp;&nbsp;{{ serviceList.contractCode
                    }}</view>
                <view></view>
            </view>
            <view style="display: flex;">
                <view style="font-size: 32rpx;color: #333333;width: 306rpx;">单位:&nbsp;&nbsp;{{ serviceList.unit }}
                </view>
                <view style="margin: auto;font-size: 32rpx;color: #333333">含税总价:&nbsp;&nbsp;{{ serviceList.amt }}</view>
                <view></view>
            </view>
        </view>
        <view style="background: #fff;border-radius:8rpx;margin: 12rpx 0;padding: 40rpx 0;">
            <view
                style="display: flex;flex-wrap: wrap;justify-content: space-around;align-items: center;padding: 0 20rpx;">
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">单价</view>
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">调整后单价</view>
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">数量</view>
                <view class="two-border" style="font-weight: bold;border-bottom: none;">变化后数量</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.price }}</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.adjustedPrice }}</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.amount }}</view>
                <view class="two-border" style="min-height: 62.4rpx;">{{ serviceList.changeNum }}</view>
            </view>
        </view>
        <view style="background: #fff;border-radius:8rpx;margin: 12rpx 0;padding: 40rpx 0;">
            <view
                style="display: flex;flex-wrap: wrap;justify-content: space-around;align-items: center;padding: 0 20rpx;">
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">合价</view>
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">变化后合价</view>
                <view class="two-border" style="font-weight: bold;border-right: none;border-bottom: none;">服务商</view>
                <view class="two-border" style="font-weight: bold;border-bottom: none;">人员</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.equipSum }}</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.donePrice }}</view>
                <view class="two-border" style="min-height: 62.4rpx;border-right: none;">{{ serviceList.serviceName }}</view>
                <view class="two-border" style="min-height: 62.4rpx;">{{ serviceList.serviceUserName }}</view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    name: "ServiceDetail",
    data() {
        return {
            serviceList: {},
            prjId: ''
        }
    },
    onLoad(option) {
        this.prjId = JSON.parse(decodeURIComponent(option.prjId))
        this.getId()
    },
    methods: {
        async getId() {
            const { data } = await this.$axios.post(`/settlement/api/settle_project/queryAdjustInfo?prjId=${this.prjId}`)
            await this.getMaterialList(data.adjId)
        },
        async getMaterialList(adjId) {
            const { data } = await this.$axios.post(`/settlement/api/server_adjust/queryQuantitiesServList?adjustId=${adjId}`)
            this.serviceList = data[0].childNodeList[0]
        },
    }

}

</script>
<style>
@import "@/common/common-ui.css";
</style>
<style>
@import "@/common/uView.css";
</style>
<style scoped lang="scss">
.two-border {
    border: 2rpx solid #dedede;
    width: 25%;
    text-align: center;
    font-size: 32rpx;
    color: #333333;
}
</style>